<template>
  <div class="box" ref="threeTarget"></div>
</template>

<script lang="ts">
  import {TEngine} from './assets/ts/TEngine'
  import meshArr from './assets/source/mesh'
  import helperArr from  './assets/source/helper'
  import {lightArr} from './assets/source/light'
  import boxArr from './assets/source/customGeo'

  import {defineComponent, ref, onMounted} from 'vue'
  export default defineComponent({
    setup() {
      const threeTarget = ref<HTMLElement | null >(null)

      onMounted(() => {
        const threeTEngine = new TEngine(threeTarget.value);
        //添加物体
        threeTEngine.addObject(...meshArr)
        //添加辅助线
        threeTEngine.addObject(...helperArr);
      //  添加光源
        threeTEngine.addObject(...lightArr);
        //添加自定义几何物体
        // threeTEngine.addObject(...boxArr)
      })

      return {
        threeTarget
      }
    }
  })
  
</script>


<style>
html,
body,
#app,
.box {
  width: 100%;
  height: 100%;
}
  
</style>
